<template>
    <view>
        <view v-if="show">
            <u-calendar :monthNum=" monthNum " :defaultDate=" defaultDate " :maxDate=" maxDate " @confirm=" confirm "
                :minDate=" minDate " :show=" showCalendar " color="#545DDE" closeOnClickOverlay 
                @close=" close "></u-calendar>
        </view>
    </view>
</template>

<script>
// 日历控件延迟显示v-if，为了解决回显问题
export default {
    name: 'chart',
    components: {
    },
    data () {
        return {
            showCalendar: false,
        }
    },
    props: {
        defaultDate: {
            type:  [Array, String, Date, null]
        },
        maxDate: {
            type: [String, Number]
        },
        minDate: {
            type: [String, Number]
        },
        show: {
            type: Boolean
        },
        monthNum: {
            type: Number
        },
        // 是否允许点击遮罩关闭日历
        closeOnClickOverlay: {
            type: Boolean,
        },
    },
    watch: {
        show (nVal, oVal) {
            setTimeout(() => {
                this.showCalendar = nVal
            }, 300);
        }
    },
    mounted () {
    },
    methods: {
        confirm (e) {
            this.$emit('confirm',e);
        },
        close () {
            this.showCalendar = false;
            setTimeout(() => {
                this.$emit('close');
            }, 300);
        },
    },
    beforeDestroy () {

    }
}
</script>

<style></style>
